Open topic with navigation

Open topic with navigation

Bindings

Properties are the customizable aspects of components, widget, actions, and dataflow blocks. Rather assign a fixed value to a property, you can set its value dynamically by binding it to a source. For example, if you want to color red text to indicate a problem, bind the Text component's color property to a source that returns a value of "red" when the condition is problematic and "black" when the condition is normal. In Solution Builder, bound properties are displayed with a blue outline, as shown in the following figure.

There are two ways to bind a property:

• Property to property: One property determines the value of another property.
• Data to property: A data value determines the value of a property.

Property-to-Property Binding Video Tutorial

Data-to-Property Binding Video Tutorial

To bind one property to another, hover over the source property until a blue dot appears, then drag the blue dot to the target property and drop it.

Sometimes both properties cannot be displayed at the same time. To bind two such properties, open a binding pop-up for one of them, as follows:

1. Hover one of the properties until a blue a dot appears.
2. Double-click the blue dot or click the blue dot and select Bind. The binding pop-up is displayed.
3. Navigate to the other property.
4. Drag the blue dot of the source property to the target property, then close the binding pop-up.

The binding pop-up can display several properties at once. To remove a property from the binding pop-up, hover over it and click Remove.

To display the source or target of a property binding, hover over the property until a blue dot appears. Click the blue dot. To view the source from which the property receives its value, choose Binding Path. To view the target to which the property sends it value, choose Binding Target. A pop-up displays the path to the source or target

To delete a binding, hover over the property until a blue dot appears, then click the blue dot. To delete the binding without resetting the value of the property, select Unbind. To delete the binding and reset the property value to its default, select Reset.

Binding Data to a Property

You can use data values to set properties. For example, to use a text box to display the current value of a temperature metric:

1. In the Outline or Document window, select the text component.
2. In the Data panel, select the relevant data source.
3. In the Metrics panel, find the temperature metric.
4. Drag the metric from the Metrics panel to the Property Inspector, and drop it on the Text property. The binding dialog is displayed.
5. In the binding dialog, select the Formatted option to display a formatted number.

Events and Triggers

Events fire when something happens, for example, when the user clicks the mouse or a process completes. Triggers perform actions, for example, displaying a callout or starting a process. Events are typically bound to triggers, for example, to display a callout when a user mouses over a component. You can also bind triggers to properties so that they execute when the value of the property changes. For example, you can bind an upload trigger to a text property to upload the text whenever the user edits it.

Binding Dataflow Output to a Property

You can also bind a value from a dataflow to a property. For example, to create a text component that displays a sentence based on the user's geographical location:

1. Add a text component to the Stage and open its dataflow.
2. In the dataflow, add a geoLocation block and set the block's enabled property to TRUE. If you are prompted to allow access to your location, accept.
3. Add two Round blocks to the dataflow and bind their inputs to the latitude and longitude outputs of the geoLocation block. Set rounding precision to 3.
4. Add a Concatenate block to the dataflow. Click its "+" sign twice to add two input properties and configure its inputs as follows:
• input 0: Type "Your location is: ""
• input 1: Link the rounded latitude number.
• input 2: Enter a comma.
• input 3: Link the rounded longitude number.
5. Finally, bind the output property of the Concatenate block to the Text property of the text component by dragging its output arrowhead to the component on the Stage.

Modifying Source Values

To specify modifications to be performed on the source value before it is assigned to the target, open the Binding dialog when you define the binding. If you are binding from a data metric, the Binding dialog opens automatically. If you are binding from a property, press the Control key before dropping the binding connector on the target. Using the Binding dialog, you can modify the source value as follows:

Value: No modification is performed.

Formatted: The target value is a formatted string version of the source value.

Expression: Use a custom expression to format the source value. This creates the target value. The expression can include a number format pattern, which must be specified in square brackets, and strings, such as units. Examples:

Offset: Performs a simple arithmetic calculation on the source value, using a specified operator and a numeric offset. Valid operators are add, subtract, multiply, divide and modulo.

Scale: A scale binding takes the source value's relationship to an original scale and returns the corresponding value on a new scale. To define the scales, you specify the minimum and maximum values for both the input and the output. For example, if the source value is 25 on a scale of 1 to 100 and you specify an output scale of 1 to 10, the result is 2.5.

Gradient: A gradient binding takes the source value's position on an original scale, and returns the color that is at the corresponding position on a specified gradient. A gradient binding requires the input minimum, input maximum, and the gradient to be used.

The binding dialog can also perform a data mapping, which uses a Case statement to evaluate the input and return the corresponding output value. For numbers, a data mapping evaluates whether the source value is less than or equal to the Case value. For other data types, the data mapping checks whether the source value is equal to the Case value.

Cases are evaluated in the order they are specified. Multiple cases can be used. To add cases, click Add. To delete a case, click Remove. If none of the statements is true, the default value is assigned to the binding's target. A data mapping is defined using the following parameters:

• Case n: A test value to compare with the input.
• Mapping n: A value to assign to the target if the expression with Case n evaluates to true.
• default: A value to assign to the target if none of the expressions are true.

Return to Atrius Developer Portal Home Page